<template>
	<view>
		<view class="header flex" v-if="showhead">
			<image style="margin-right: 10rpx;" :src="imgurl+'type.png'" @tap="test"></image>
			<input placeholder="搜索问卷标题" @focus="getFocus" confirm-type="search" @confirm="getTitle" v-model="searchtitle" />
			<view class="right" @tap="Create">创建</view>
			<view class="dingwei" v-if="show">
				<view class="sanjiao"></view>
				<view class="dw-item flex" @tap="questionHall">
					<image :src="imgurl+'wenjuan.png'"></image>
					<text>问卷大厅</text>
				</view>
				<view class="dw-item flex" @tap="myWeNG">
					<image :src="imgurl+'wenjuan.png'"></image>
					<text>我的问卷</text>
				</view>
				<view class="dw-item flex" @tap="Person">
					<image :src="imgurl+'mine.png'"></image>
					<text>个人中心</text>
				</view>
				<view class="dw-item flex" @tap="Collect">
					<image :src="imgurl+'reback.png'"></image>
					<text>回收站</text>
				</view>
				<view class="dw-item flex" @tap="backLogin">
					<image :src="imgurl+'tuichu.png'"></image>
					<text>退出</text>
				</view>
			</view>
		</view>
		<view class="header flex" v-else>
			<input @confirm="getTitle" placeholder="搜索问卷标题" @focus="getFocus" confirm-type="search" v-model="searchtitle" />
			<view class="right" @tap="Cencal">取消</view>
		</view>
		<view style="padding-top: 96rpx;box-sizing: border-box;"> 
			<view class="main" v-for="(item,index) in list" :key="index" @tap="handlelist(index)">
				<view class="main-title flex">
					<view class="flex_1">
						<text class="text-one">{{item.namewenid}}</text>
					</view>
					<view class="flex" style='width: 21%;'>
						<text class="text-four" :class="[item.fa==2?'showstate': '']"></text>
						<text class="text-three">{{item.fa==1 ? '未发布' : (item.fa == 2 ? '发布中' : '结束发布')}}</text>
					</view>
				</view>
				<view v-if="item.fa == 2" class="main-top flex">
					<view>总答卷:<text>{{item.darenshu==null?'':item.darenshu}}</text></view>
					<view>有效答卷:<text>{{item.youxiaojuan==null?'':item.youxiaojuan}}</text></view>
					<view>问卷类型:<text>{{item.type==1?'调查':item.type == 2 ? '表单' : '投票'}}问卷</text></view>
				</view>
				<view class="main-content">{{item.text==null?'':item.text}}</view>
				<view class="main-bottom">
					<text v-if="item.fadate">发布：{{item.fadate==null?'':item.fadate}}</text>
					<text v-if="item.update">结束：{{item.update == null?'':item.update}}</text>
				</view>
				<view class="main-imgs flex" v-if="item.showIcon">
					<view class="imgs-item row" @tap.stop="edit(item.wenid,item.fa,item.id,item.type)">
						<image :src="imgurl+'edit.png'"></image>
						<text>编辑</text>
					</view>
					<view class="imgs-item row" @tap.stop="share(item.wenid, item.id, item.fa, item.pid, item.wxpid)">
						<image :src="imgurl+'share.png'"></image>
						<text>分享</text>
					</view>
					<view class="imgs-item row" @tap="census(item.wenid, item.zongshu)">
						<image :src="imgurl+'result.png'"></image>
						<text>结果</text>
					</view>
					<view v-if="guang == 2" class="imgs-item row" @tap="setModel(item.wenid)">
						<image :src="imgurl+'result.png'"></image>
						<text>设为模板</text>
					</view>
					<view class="imgs-item row" @tap.stop="showPopup(item.fa,item.wenid,item.id,item.pid, item.wxpid)">
						<image :src="imgurl+'more.png'"></image>
						<text>更多</text>
					</view>
				</view>
			</view>
		</view>
		<view class="more" @tap="moreTitle = '暂无数据' ? '':More">{{moreTitle}}</view>
		<uni-popup ref="popup" type="bottom">
			<view class="pop-main" @tap="publish">{{title}}</view>
			<view class="pop-main" @tap="Copy">复制</view>
			<view class="pop-main" @tap="delWen">删除</view>
			<view class="kong"></view>
			<view class="pop-main" @tap="unShowpopup">取消</view>
		</uni-popup>
	</view>
</template>

<script>
	import api from "@/common/api.js";
	import {
		baseURL
	} from "@/common/http.js";
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import app from "../../App.vue"
	export default {
		components: {
			uniPopup
		},
		data() {
			return {
				imgurl: "",
				show: false,
				showhead: true,
				searchtitle: "",
				title: "",
				page: 1,
				list: [],
				moreTitle: '点击加载更多',
				wenid: '',
				id: '',
				ip: '',
				pid: '',
				namewenid: '',
				jid: '', // 问卷id,
				wxpid: '',
				guang: '',
				fa: ''
			}
		},
		methods: {
			//我的问卷
			myWeNG() {
				uni.navigateTo({
					url: "../personal/myQns/myQns"
					// url: "../personal/myQuestion/myQuestion"
				})
			},
			// 设置模板
			setModel(wenid) {
				uni.navigateTo({
					url: '../create/create?wenid=' + wenid + '&fromUrl=model'
				})
			},
			//搜索(问卷名字)
			getTitle() {
				let that = this
				that.List({
					api: 'wenpeg',
					namewenid: this.searchtitle,
					table: 3,
					order: 'id desc',
					name: this.id
				})
			},
			//点击加载更多
			More() {
				let that = this
				let data = {
					api: 'wenpeg',
					table: 3,
					page: ++this.page,
					name: this.id,
					
					del: 1,
					order: 'id desc',
				}
				api.quesList(data).then(res => {
					if (res.code === 200) {
						that.list = that.list.concat(res.date)
					} else if (res.code === 404) {
						uni.showToast({
							title: '没有更多数据了~',
							icon: 'none',
							duration: 2000
						})
						that.moreTitle = "已经到底了哦~"
					}
					let obj = {
						showIcon: false
					}
					that.list.forEach((item, index) => {
						item.showIcon = false
					})
				}).catch(err => {
					console.log(err)
				})
			},
			handlelist(index) {
				this.show = false
				let ids = index
				let arr = this.list
				let newArr = arr.map((item, index) => {
					if (index == ids) {
						item.showIcon = !item.showIcon
					} else {
						item.showIcon = false
					}
					return item
				})
				this.list = newArr
			},
			test() {
				this.show == true ? this.show = false : this.show = true
			},
			//点击更多
			showPopup(e, wenid, id, pid, wxpid) {
				this.wenid = wenid
				this.jid = id
				this.pid = pid
				this.wxpid = wxpid
				this.fa = e
				if (e == 2) {
					this.title = "停止"
				} else {
					this.title = "发布"
				}
				this.$refs.popup.open()
			},
			getFocus() {
				this.showhead = false
			},
			Cencal() {
				this.showhead = true
			},
			//创建
			Create() {
				if (uni.getStorageSync('message') && uni.getStorageSync('message')[0].call) {
					uni.navigateTo({
						url: "../create/create"
					})
				} else {
					uni.showModal({
						title: '该账户没有绑定手机号',
						content: '重新登录，并绑定手机号？',
						confirmColor: '#209FFC',
						confirmText: '确定',
						cancelText: '取消',
						success: (res) => {
							if (res.confirm) {
								setTimeout(() => {
									uni.navigateTo({
										url: '../loginIndex/loginIndex'
									})
								}, 500)
							} else if (res.cancel) {}
						}
					})
				}
			},
			//个人中心
			Person() {
				uni.getStorage({
					key: 'message',
					success: (res) => {
						if (res && res.data) {
							setTimeout(() => {
								uni.navigateTo({
									url: "../personal/person/person?id=" + res.data[0].id
								})
							}, 500)
						}
					},
					fail: () => {
						uni.showModal({
							title: '提示',
							content: '您当前未登录,登录后才能操作',
							confirmColor: '#209FFC',
							success: (res) => {
								if (res.confirm) {
									setTimeout(() => {
										uni.navigateTo({
											url: '../loginIndex/loginIndex'
										})
									}, 500)
								}
							}
						})
					}
				})
			},
			//问卷大厅
			questionHall() {
				uni.navigateTo({
					url: "../questionHAall/questionHAall"
				})
			},
			//回收站
			Collect() {
				uni.getStorage({
					key: 'message',
					success: (res) => {
						if (res && res.data) {
							uni.navigateTo({
								url: "../collect/collect?id=" + res.data[0].id
							})
						} else {
							uni.showModal({
								title: '系统提示',
								content: '您当前未登录,登录后才能操作',
								confirmColor: '#209FFC',
								success: function(resp) {
									if (resp.confirm) {
										setTimeout(() => {
											uni.navigateTo({
												url: '../loginIndex/loginIndex'
											})
										}, 500)
									} else if (resp.cancel) {}
								}
							})
						}
					}
				})
			},
			//退出
			backLogin() {
				uni.getStorage({
					key: 'message',
					success: (res) => {
						uni.removeStorage({
							key: 'message',
							success: (res) => {
								uni.showToast({
									title: '退出成功',
									icon: 'none',
									duration: 1500,
									success: () => {
										setTimeout(() => {
											uni.navigateTo({
												url: '../loginIndex/loginIndex'
											})
										}, 1500)
									}
								})
							}
						})
					},
					fail: () => {
						uni.showModal({
							title: '系统提示',
							content: '您当前未登录,登录后才能操作',
							confirmColor: '#209FFC',
							success: function(resp) {
								if (resp.confirm) {
									setTimeout(() => {
										uni.navigateTo({
											url: '../loginIndex/loginIndex'
										})
									}, 500)
								} else if (resp.cancel) {}
							}
						})
					}
				})
			},
			//结果
			census(id, renNum) {
				let num = renNum
				if (num > 0) {
					uni.navigateTo({
						url: "../census/censusResult/censusResult?wenid=" + id
					})
				} else {
					uni.showToast({
						title: '此问卷还没有题目',
						icon: 'none',
						duration: 2000
					})
				}
			},
			//编辑
			edit(wenid, fa, id, type) {
				let that = this
				let ids = wenid
				let tid = id
				this.$store.commit('setWjType', type)
				if (fa != 2) {
					if (type == 1) {
						uni.navigateTo({
							url: "../editDiaocha/editDiaocha?wenid=" + ids
						})
					} else if (type == 2) {
						app.globalData.typewj = 2
						uni.navigateTo({
							url: "../createForm/editForm/editForm?wenid=" + ids
						})
					} else {
						app.globalData.typewj = 3
						uni.navigateTo({
							url: "../createVote/editVote/editVote?wenid=" + ids
						})
					}
				} else {
					uni.showModal({
						title: '编辑问卷时将暂停发布，其他人无法答卷，编辑完成后您需要重新发布。',
						content: '您是否需要继续？',
						confirmColor: '#209FFC',
						confirmText: '继续编辑',
						cancelText: '暂不编辑',
						success: function(res) {
							if (res.confirm) {
								let data = {
									api: 'updatec',
									id: tid,
									fa: 3,
									table: 3
								}
								api.look(data).then(res => {
									if (res.code == 200) {
										that.list.forEach((item, index) => {
											if (item.id == that.id) {
												that.list[index].fa = 1
												that.$refs.popup.close()
											}
										})
									}
								}).catch(err => {
									console.log(err)
								})
								setTimeout(() => {
									uni.navigateTo({
										url: "../editDiaocha/editDiaocha?wenid=" + ids
									})
								}, 1000)
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				}
				/* let data = {
					api: 'wenlog',
					wenid: ids,
					nameid: uni.getStorageSync('message').id,
					cao: '编辑'
				}
				api.look(data).then(res => {
					console.log(res)
				}).catch(err => {
					console.log(err)
				}) */
			},
			//分享
			share(wenid, id, state, pid, wxpid) {
				let that = this
				if (state != 2) {
					uni.showModal({
						title: '系统提示',
						content: '此问卷还未发布，确定发布吗?',
						confirmColor: '#209FFC',
						success: function(res) {
							if (res.confirm) {
								//点击确定  查看问卷是否有题目
								let data = {
									api: 'wentimu',
									wenid: wenid
								}
								api.look(data).then(res => {
									if (res.code == 200) {
										//点击确定成功后 发布
										if (pid == 1) {
											api.look({
												api: 'updatec',
												id: id,
												fa: 2,
												table: 3
											}).then(res => {
												if (res.code == 200) {
													uni.showToast({
														title: '发布成功',
														icon: 'success',
														duration: 1500,
														success: () => {
															setTimeout(() => {
																uni.navigateTo({
																	url: '../share/share?wenid=' + wenid + '&wxpid=' + wxpid
																})
															}, 1500)
														}
													})
												}
											}).catch(err => {
												console.log(err)
											})
										} else {
											uni.showToast({
												title: '问卷被锁定，不能发布',
												duration: 1000,
												icon: 'none'
											})
										}
									} else {
										uni.showModal({
											title: '系统提示',
											content: '此问卷没有添加题目,不能发布!',
											confirmColor: '#209FFC',
											confirmText: '知道了',
											showCancel: false,
											success: function(res) {
												if (res.confirm) {
													that.$refs.popup.close()
												} else if (res.cancel) {
													console.log('用户点击取消');
												}
											}
										});
									}
								}).catch(err => {
									console.log(err)
								})
							} else if (res.cancel) {
								uni.showToast({
									title: '取消分享',
									icon: 'none',
									duration: 1500
								})
							}
						}
					});
				} else {
					that.handleShare(wenid, wxpid)
				}
			},
			// toShare
			handleShare(wenid, wxpid) {
				api.look({
					api: 'wenfen',
					nameid: uni.getStorageSync('message')[0].id,
					wenid: wenid
				}).then(res => {
					if (res.code == 200) {
						setTimeout(() => {
							uni.navigateTo({
								url: '../share/share?wenid=' + wenid + '&wxpid=' + wxpid
							})
						}, 1000)
					}
				}).catch(err => {
					console.log(err)
				})
			},
			//复制
			Copy() {
				let _this = this
				uni.showModal({
					title: '系统提示',
					content: '确定要复制这份问卷吗?',
					confirmColor: '#209FFC',
					success: function(res) {
						if (res.confirm) {
							api.look({
								wenid: _this.wenid,
								table: 1,
								api: 'weifu',
								nameid: uni.getStorageSync('message')[0].id
							}).then(res => {
								if (res && res.code == 200) {
									uni.showToast({
										title: '复制成功',
										duration: 1500,
										icon: 'none'
									})
									_this.$refs.popup.close()
									_this.page = 1
									_this.List({
										api: 'wenpeg',
										table: 3,
										del: 1,
										order: 'id desc',
										name: _this.id,
										page: _this.page
									})
								}
							}).catch(err => {
								console.log(err)
							})
						} else if (res.cancel) {
							uni.showToast({
								title: '取消复制',
								icon: 'none',
								duration: 1500
							})
						}
					}
				});
			},
			//删除
			delWen() {
				let that = this
				if (this.fa == 2) {
					uni.showToast({
						title: '发布中的问卷不能删除',
						icon: 'none',
						duration: 2000
					})
				} else {
					uni.showModal({
						title: '系统提示',
						content: '确定要删除这份问卷吗?',
						confirmColor: '#209FFC',
						success: function(res) {
							if (res.confirm) {
								let data = {
									api: 'updatec',
									id: that.jid,
									del: 2,
									table: 3
								}
								api.del(data).then(res => {
									if (res.code == 200) {
										that.$refs.popup.close()
										uni.showToast({
											title: '删除成功',
											icon: 'success',
											duration: 2000,
											success: () => {
												that.page = 1
												that.List({
													api: 'wenpeg',
													table: 3,
													del: 1,
													order: 'id desc',
													name: that.id,
													page: that.page
												})
											}
										})
									}
								}).catch(err => {
									console.log(err)
								})
							} else if (res.cancel) {
								uni.showToast({
									title: '取消删除',
									icon: 'none',
									duration: 1500
								})
							}
						}
					})
				}
			},
			//发布
			publish() {
				let that = this
				if (uni.getStorageSync('message') && uni.getStorageSync('message')[0].call) {
					if (this.title == '停止') {
						uni.showModal({
							title: '系统提示',
							content: '暂停后问卷将无法填写，确认吗?',
							confirmColor: '#209FFC',
							success: function(res) {
								if (res.confirm) {
									api.look({
										api: 'updatec',
										id: that.jid,
										fa: 3,
										table: 3
									}).then(res => {
										if (res.code == 200) {
											that.page = 1
											that.List({
												api: 'wenpeg',
												table: 3,
												del: 1,
												order: 'id desc',
												name: that.id,
												page: that.page
											})
										}
									}).catch(err => {
										console.log(err)
									})
									that.$refs.popup.close()
								} else if (res.cancel) {
									console.log('用户点击取消')
								}
							}
						});
					} else {
						if (this.pid == 1) {
							api.look({
								api: 'wentimu',
								wenid: this.wenid
							}).then(res => {
								if (res.code == 200) {
									api.look({
										api: 'updatec',
										id: that.jid,
										fa: 2,
										table: 3
									}).then(res => {
										if (res.code == 200) {
											that.page = 1
											that.List({
												api: 'wenpeg',
												table: 3,
												del: 1,
												order: 'id desc',
												name: that.id,
												page: that.page
											})
										}
									}).catch(err => {
										console.log(err)
									})
									uni.showModal({
										title: '发布成功',
										content: '是否立即分享',
										confirmColor: '#209FFC',
										success: function(res) {
											if (res.confirm) {
												setTimeout(() => {
													console.log(that.wenid, that.wxpid, 'DF')
													uni.navigateTo({
														url: '../share/share?wenid=' + that.wenid + '&wxpid=' + that.wxpid
													})
												}, 1000)
											}
											that.$refs.popup.close()
										}
									});
								} else {
									uni.showModal({
										title: '系统提示',
										content: '此问卷没有添加题目,不能发布!',
										confirmColor: '#209FFC',
										confirmText: '知道了',
										showCancel: false,
										success: function(res) {
											if (res.confirm) {
												that.$refs.popup.close()
											} else if (res.cancel) {
												console.log('用户点击取消');
											}
										}
									});
								}
							}).catch(err => {
								console.log(err)
							})
						} else {
							uni.showToast({
								title: "问卷被锁定，不能发布",
								icon: 'none',
								duration: 1000
							})
							this.$refs.popup.close()
						}
					}
				} else {
					uni.showModal({
						title: '该账户没有绑定手机号',
						content: '重新登录，并绑定手机号？',
						confirmColor: '#209FFC',
						confirmText: '确定',
						cancelText: '取消',
						success: (res) => {
							if (res.confirm) {
								setTimeout(() => {
									uni.navigateTo({
										url: '../loginIndex/loginIndex'
									})
								}, 500)
							} else if (res.cancel) {}
						}
					})
				}
			},
			unShowpopup() {
				this.$refs.popup.close()
			},
			List(data) {
				api.quesList(data).then(res => {
					if (res.code == 200) {
						this.list = res.date
						let len = this.list.length
						for (let i = len - 1; i >= 0; i--) {
							let item = this.list[i]
							if (item.date !== null) {
								item.date = item.date.substring(0, item.date.length - 3)
							}
							if (item.fadate !== null) {
								item.fadate = item.fadate.substring(0, item.fadate.length - 3)
							}
							if (item.update !== null) {
								item.update = item.update.substring(0, item.update.length - 3)
							}
						}
					} else {
						console.log('aaaaaaaaaa')
						this.list = []
						this.moreTitle = "暂无数据"
						this.$forceUpdate();
					}
				}).catch(err => {
					console.log('bbbbbbbbbb')
					console.log(err)
				})
			} 
		},
		onLoad() {
			this.imgurl = app.globalData.imgurl
		},
		onShareAppMessage(options) {
			let shareObj = {
				success: (res) => {
					if (res.errMsg == 'shareAppMessage:ok') {
						uni.showToast({
							title: '分享成功',
							icon: 'success',
							duration: 1500
						})
					}
				},
				fail: () => {
					if (res.errMsg == 'shareAppMessage:fail cancel') {
						uni.showToast({
							title: '取消分享',
							icon: 'none',
							duration: 2000
						})
					} else if (res.errMsg == 'shareAppMessage:fail') {
						// 转发失败，其中 detail message 为详细失败信息
					}
				},
				complete: () => {
					// 转发结束之后的回调（转发成不成功都会执行）
				}
			}
		},
		onShow() {
			if (uni.getStorageSync('message') && uni.getStorageSync('message')[0].id) {
				this.guang = uni.getStorageSync('message')[0].guang
				this.id = uni.getStorageSync('message')[0].id
				this.List({
					api: 'wenpeg',
					table: 3,
					del: 1,
					order: 'id desc',
					name: this.id,
					page: this.page
				})
				api.look({
					api: 'wenfind',
					table: '1',
					id: this.id 
				}).then(res => {
					if(res &&res.code == 200) {
						uni.setStorageSync('message', res.date)
						this.id = res.date[0].id
					}
				})
			} else {
				uni.reLaunch({
					url: '../questionHAall/questionHAall'
				})
				this.guang = ''
			}
			this.show = false
			/* uni.getStorage({
				key: 'message',
				success: (res) => {
					this.id = res.data[0].id
					this.List({
						api: 'wenpeg',
						table: 3,
						del: 1,
						order: 'id desc',
						name: res.data[0].id,
						page: this.page
					})
				},
				fail() {
					this.moreTitle = ""
				}
			}) */
		}
	}
</script>

<style lang="scss">
	page {
		background: #F0F0F0;
		height: 100%;
		width: 100%;
	}

	.header {
		justify-content: space-around;
		padding: 15rpx;
		background: #fff;
		box-sizing: border-box;
		position: fixed;
		width: 100%;

		input {
			flex: 1;
		}

		.dingwei {
			width: 220rpx;
			padding: 15rpx 0;
			box-sizing: border-box;
			position: absolute;
			top: 100rpx;
			left: 0;
			background: #000;
			opacity: 0.7;
			z-index: 1000;

			.sanjiao {
				width: 0;
				height: 0;
				border-left: 20rpx solid transparent;
				border-right: 20rpx solid transparent;
				border-bottom: 20px solid black;
				position: absolute;
				top: -30rpx;
				left: 25rpx;
			}

			.dw-item {
				height: 70rpx;
				line-height: 70rpx;
				color: #fff;
				font-size: 32rpx;

				image {
					width: 48rpx;
					height: 48rpx;
					margin-right: 15rpx;
				}
			}
		}

		image {
			width: 60rpx;
			height: 60rpx;
		}

		input {
			// width: 520rpx;
			height: 60rpx;
			border-radius: 30rpx;
			background: #F0F0F0;
			border-radius: 30rpx;
			padding-left: 15rpx;
			box-sizing: border-box;
		}

		.right {
			width: 100rpx;
			height: 60rpx;
			background: #209FFC;
			border-radius: 30rpx;
			color: #fff;
			line-height: 60rpx;
			text-align: center;
			margin-left: 20rpx;
		}
	}

	.main {
		width: 710rpx;
		margin: 20rpx auto;
		background: #fff;
		border-radius: 15rpx;
		padding: 15rpx;
		box-sizing: border-box;
	}

	.main-title {
		width: 100%;
		flex-direction: row;
		justify-content: flex-start;
		flex-wrap: nowrap;

		.flex_1 {
			flex: 1;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			overflow: hidden;

			.text-one {
				color: #333;
				font-size: 34rpx;
				font-weight: bold;
			}
		}

		.text-two {
			color: #333;
			font-size: 30rpx;
			font-weight: 500;
		}

		.text-three {
			color: #999;
			font-size: 24rpx;
			margin-right: 20rpx;
		}

		.text-four {
			width: 15rpx;
			height: 15rpx;
			background: #999;
			border-radius: 50%;
			margin-right: 10rpx;
		}

		.showstate {
			background: #42E44A;
		}

	}

	.main-top {
		view {
			color: #333;
			font-size: 30rpx;
			margin: 15rpx 0;
			flex: .6;
			text {
				color: #209FFC;
				margin-left: 20rpx;
			}
			&:last-child {
				flex: 1;
				text-align: right;
			}
		}

	}

	.main-content {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		color: #999;
		font-size: 24rpx;
		line-height: 30rpx;
	}

	.main-bottom {
		font-size: 24rpx;
		color: #666;
		margin: 20rpx 0;

		text {
			width: 50%;
			display: inline-block;
		}
	}

	.main-imgs {
		justify-content: space-between;

		.imgs-item {
			image {
				width: 60rpx;
				height: 60rpx;
			}

			text {
				font-size: 24rpx;
				color: #999;
			}
		}
	}

	.more {
		width: 690rpx;
		height: 80rpx;
		margin: 10rpx auto;
		text-align: center;
		font-size: 32rpx;
		color: #333;
	}

	.pop-main {
		background-color: #fff;
		height: 100rpx;
		line-height: 100rpx;
		color: #333;
		text-align: center;
		font-size: 36rpx;
		font-weight: 500;
		border-bottom: 1rpx solid #F0F0F0;
	}

	.kong {
		width: 100%;
		height: 20rpx;
		background-color: #DCDCDC;
	}
</style>
